<script>
import outMain from "@/components/outMain.vue";
import { ElMessage, ElMessageBox } from "element-plus";
import { Stationset, StationsetShow } from "@/http/api";

export default {
  components: { outMain },
  name: "",
  data() {
    return {
      formData: {
        zdgbxz: "",
        csgwsl: "",
        gwjg: "",
      },
      rules: {
        zdgbxz: [
          {
            required: true,
            message: "请输入岗位自动关闭限制",
            trigger: "blur",
            min: 0,
            max: 5,
          },
        ],
        csgwsl: [
          {
            required: true,
            message: "请输入初始企业岗位数量",
            trigger: "blur",
            min: 0,
            max: 5,
          },
        ],
        gwjg: [
          {
            required: true,
            message: "请输入岗位购买价格",
            trigger: "blur",
            min: 1,
            max: 10,
          },
        ],
      },
    };
  },
  props: {},
  setup() {},
  methods: {
    async saveFn() {
      const valid = await this.$refs.ruleForm.validate();
      if (!valid) {
        return;
      }
      let data = this.formData;
      Stationset(data).then((res) => {
        if (res.data.code == 1) {
          ElMessage({
            type: "success",
            message: "保存成功",
          });
        }
      });
    },
    getData() {
      StationsetShow().then((res) => {
        if (res.data.code == 1) {
          this.formData = res.data.data;
        }
      });
    },
  },
  created() {
    this.getData();
  },
};
</script>
<template>
  <outMain>
    <div class="formCont">
      <div class="formStep">
        <div class="formHead">
          <div>岗位配置</div>
        </div>
        <div class="formMain">
          <div class="stepCont">
            <div class="formDes flexPull">
              <div class="desTitle">
                <div>岗位配置项</div>
              </div>
              <el-form :rules="rules" ref="ruleForm" :model="formData">
                <div class="pullCont hasTop">
                  <el-form-item
                    label-width="150"
                    prop="zdgbxz"
                    label="岗位自动关闭限制"
                  >
                    <el-input
                      v-model="formData.zdgbxz"
                      placeholder="请输入自动关闭限制"
                    >
                      <template #append>天自动关闭</template>
                    </el-input>
                  </el-form-item>
                  <el-form-item
                    label-width="150"
                    prop="csgwsl"
                    label="初始企业岗位数量"
                  >
                    <el-input
                      v-model="formData.csgwsl"
                      placeholder="请输入初始岗位数量"
                    >
                      <template #append>个免费岗位</template>
                    </el-input>
                  </el-form-item>
                  <el-form-item
                    label-width="150"
                    prop="gwjg"
                    label="岗位购买价格"
                  >
                    <el-input
                      v-model="formData.gwjg"
                      placeholder="请输入岗位价格"
                    >
                      <template #append>鲸币/个</template>
                    </el-input>
                  </el-form-item>
                  <el-form-item class="flexPull" label=" " label-width="150">
                    <btn value="保存设置" @ok="saveFn"></btn>
                  </el-form-item>
                </div>
              </el-form>
            </div>
          </div>
        </div>
      </div>
    </div>
  </outMain>
</template>
<style scoped lang="less"></style>
